<template>
  <el-card>
    <div class="CHDALL">
      <div class="CHDLeft"></div>
      <div class="CHDContent">
        <div class="CHDCContent">
          <span style="padding: 20px">病历编号：{{ cid }}</span>
          <h1>辛集市乡村卫生室处方</h1>
          <el-form :model="ViCaseHistory" ref="ViCaseHistory" :rules="rules">
            <el-row :gutter="24">
              <el-form-item label="姓名:" prop="cname" class="ViLabel">
                <el-input
                  v-model="ViCaseHistory.cname"
                  disabled
                  style="width: 160px"
                />
              </el-form-item>
              <el-form-item label="性别:" prop="sex" class="ViLabel">
                <el-select
                  v-model="ViCaseHistory.sex"
                  placeholder="性别"
                  style="width: 100px"
                  disabled
                >
                  <el-option label="男" value="1" />
                  <el-option label="女" value="0" />
                </el-select>
              </el-form-item>
              <el-form-item label="年龄:" prop="age" class="ViLabel">
                <el-input
                  v-model="ViCaseHistory.age"
                  style="width: 120px"
                  disabled
                />
              </el-form-item>
              <el-form-item label="体重:" prop="weight" class="ViLabel">
                <el-input
                  v-model="ViCaseHistory.weight"
                  placeholder="Kg"
                  style="width: 160px"
                  disabled
                />
              </el-form-item>
            </el-row>
            <el-row :gutter="24">
              <el-form-item label="电话:" prop="telephone" class="ViLabel">
                <el-input
                  v-model="ViCaseHistory.telephone"
                  disabled
                  style="width: 160px"
                />
              </el-form-item>
              <el-form-item label="地址:" prop="address" class="ViLabel">
                <el-input
                  v-model="ViCaseHistory.address"
                  style="width: 551px"
                  disabled
                />
              </el-form-item>
            </el-row>
            <el-row :gutter="24">
              <el-form-item label="过敏及特殊病史:" prop="chistory" id="exra">
                <el-input
                  v-model="ViCaseHistory.chistory"
                  style="width: 726px"
                  disabled
                />
              </el-form-item>
            </el-row>
            <el-row :gutter="24">
              <el-form-item label="诊断:" prop="vresult" class="ViLabel">
                <el-input
                  v-model="ViCaseHistory.vresult"
                  style="width: 795px"
                  disabled
                />
              </el-form-item>
            </el-row>
            <el-row :gutter="24">
              <h2 style="font-size: 30px; margin-left: 40px">Rp</h2>
            </el-row>
            <el-row :gutter="24">
              <el-form-item label="处置:" prop="vmethod" class="ViLabel">
                <el-input
                  v-model="ViCaseHistory.vmethod"
                  :autosize="{ minRows: 2, maxRows: 4 }"
                  style="width: 795px"
                  type="textarea"
                  :disabled="Flag"
                />
              </el-form-item>
            </el-row>
            <el-row :gutter="24">
              <el-form-item label="病历生成时间:" prop="vtime" class="ViTime">
                <span style="display: flex; float: right">{{
                  ViCaseHistory.vtime
                }}</span>
              </el-form-item>
            </el-row>
          </el-form>
        </div>
      </div>
      <div class="CHDRight"></div>
    </div>
  </el-card>
</template>

<script>
import { QueryChByCid } from "@/api/caseHistory";
export default {
  data() {
    return {
      Flag: true,
      ViCaseHistory: {
        cname: "",
        sex: "",
        age: "",
        weight: "",
        telephone: "",
        address: "",
        chistory: "",
        vtime: "", //就诊时间
        vresult: "", //诊断结果
        vmethod: "", //药方
        idcard: "",
        vtime: null,
      },
    };
  },
  created() {
    this.cid = this.$route.query.param;
    QueryChByCid(this.cid).then((res) => {
      // console.log(res.data.data);
      this.ViCaseHistory.cname = res.data.data[0].cname;
      this.ViCaseHistory.sex = res.data.data[0].sex.toString();
      this.ViCaseHistory.age = res.data.data[0].age;
      this.ViCaseHistory.idcard = res.data.data[0].idcard;
      this.ViCaseHistory.telephone = res.data.data[0].telephone;
      this.ViCaseHistory.address = res.data.data[0].address;
      this.ViCaseHistory.weight = res.data.data[0].weight+"kg";
      this.ViCaseHistory.vmethod = res.data.data[0].vmethod;
      this.ViCaseHistory.vresult = res.data.data[0].vresult;
      this.ViCaseHistory.chistory = res.data.data[0].chistory;
      this.ViCaseHistory.vtime = res.data.data[0].vtime;
    });
  },
};
</script>
<style>
.ViLabel .el-form-item__label {
  width: 85px !important;
}
.ViTime .el-form-item__label {
  width: 750px !important;
}
#exra .el-form-item__label {
  width: 155px !important;
}
</style>
<style scoped>
.CHDCContent h1 {
  font-size: 25px;
  text-align: center;
  padding: 5px;
  margin-top: 10px;
  font-weight: 600;
  font-family: "楷体";
}

.CHDCContent {
  width: 100%;
  height: 100%;
  font-weight: 600;
  background-color: white;
}

.CHDALL {
  display: flex;
  flex-direction: row;
  width: 100vw;
  height: 77vh;
}

.CHDContent {
  width: 60%;
  height: 100%;
}

.CHDRight {
  width: 15%;
  height: 100%;
}

.CHDLeft {
  width: 15%;
  height: 100%;
}
</style>
